<template>
  <!-- 占用 -->
  <div>
    <el-dialog
      v-el-drag-dialog
      title="客户占用瓶信息"
      :append-to-body="true"
      :visible.sync="visible"
      width="600px"
    >
      <lb-table
        ref="lbTable"
        v-loading="$loadingPlugin.fetchData"
        border
        highlight-current-row
        element-loading-text="加载中"
        :column="tableData.column"
        :data="tableData.data"
        :immediate-fetch="false"
        :pagination="false"
        :summary-method="getSummaries"
        custom-column
        show-summary
        @fetch="fetchData"
      />
    </el-dialog>
  </div>
</template>

<script>
  import { queryCsmGasCountList } from '@/api'

  export default {
    name: 'occupy',
    data() {
      return {
        visible: false,
        csmId: '',
        temp: {},
        tableData: {
          column: [
            {
              type: 'index'
            },
            {
              prop: 'specName',
              label: '规格型号'
            },
            {
              prop: 'bottleCount',
              label: '数量'
            },
            {
              prop: 'chipCodes',
              label: '气瓶条码',
              showOverflowTooltip: true
            }
          ],
          data: []
        }
      }
    },
    methods: {
      open(temp) {
        this.csmId = temp.csmId
        this.fetchData({ currentPage: 1, pageSize: 10 })
        return new Promise(resolve => {
          this.resolve = resolve
          this.visible = true
          if (temp) {
            this.temp = Object.assign(this.temp, temp)
          }
        })
      },
      async fetchData() {
        const query = {
          csmId: this.csmId
        }
        const res = await queryCsmGasCountList(query)
        this.tableData.data = res.data
      },
      // 合计方法
      getSummaries(param) {
        const { columns, data } = param
        const sums = []
        columns.forEach((column, index) => {
          if (index === 1) {
            sums[index] = '合计'
            return
          }
          if (column.property === 'curGasCountTypeName') {
            return
          }
          const values = data.map(item => Number(item[column.property]))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
          }
        })

        return sums
      }
    }
  }
</script>

<style lang='scss' scoped>

</style>
